<%--
  Created by IntelliJ IDEA.
  User: admin
  Date: 2021/6/21
  Time: 8:52 上午
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--    导航begin--%>
<div class="container-fluid">
    <div class="row">
        <nav class="navbar navbar-inverse" role="navigation">
            <div class="container-fluid">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse"
                            data-target="#example-navbar-collapse">
                        <span class="sr-only">切换导航</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#">八一农垦</a>
                </div>
                <div class="collapse navbar-collapse" id="example-navbar-collapse">
                    <ul class="nav navbar-nav navbar-right">
                        <li>
                            <form class="navbar-form navbar-left" role="search">
                                <div class="input-group">
                                    <input value="${name}" type="text" id="search_input" class="form-control">
                                    <span class="input-group-btn">
                        <button class="btn btn-default" type="button" onclick="search_name()">search</button>
                    </span>
                                </div>
                            </form>
                        </li>
                        <li class="active"><a href="/product/index">首页</a></li>
                        <li><a href="#">${user.username}</a></li>
                        <li><a href="/user/index">登录</a></li>
                        <li><a href="#" data-toggle="modal" data-target="#myModal">注册</a></li>
                        <li><a href="#">我的订单</a></li>

                        <c:if test="${user!=null}">
                            <li><a href="#">我的订单</a></li>
                            <li><a href="/user/exit">安全退出</a></li>
                            <li><img class="nav_img" src="/imgs/zz.jpeg"></li>
                        </c:if>

                    </ul>
                </div>
            </div>
        </nav>
    </div>
</div>
<%--    导航end--%>

<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">模态框（Modal）标题</h4>
            </div>
            <div class="modal-body">在这里添加一些文本</div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary">提交更改</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<script>
    // 搜索按钮完成的功能
    function search_name(){
        //1. 获取搜索的文本框中输入的数据
        let search_input_value = document.getElementById("search_input").value;
        //2. 发送参数到后台
        //window.localtion='url?参数名1=参数值2&参数名2=参数值2&参数名3=参数值4'
        window.location='/movie/index?name='+search_input_value;
    }
</script>